<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		div {width: 100px; height: 100px; background-color: #45dfff; margin: 10px;}
	</style>
	<script src="../jquery-1.10.1.min.js"></script>
	<script type="text/javascript">
	/*
		$()下的常用方法:
			animate(JSON  ) : 
				第一个参数是一个json -> {属性，属性值}
				第二个参数是时间 -> 毫秒(默认400)
				第三个参数：运动形式  只有两种运动形式: swing(慢快慢,默认), linear(匀速)【都要加 引号】
				第四个参数：回调函数
	*/
	$(function() {
		$('#div1').click(function() {
			$(this).animate( {"width":300,"height":300}, 1000, 'swing', function() {alert(123)});
			$('#div2').animate( {"width":300,"height":300}, 1000, 'linear');
		})
	});
	</script>
</head>
<body>
	<div id="div1"></div>
	<div id="div2"></div>
</body>
</html>